<!--
  - Copyright (c) 2019.
  - 北京九思金信科技有限公司对该文件内容保留所有权利。
  - 未经许可，不得私自拷贝、传播、发布、引用该文件内容，违者将被追究法律责任。
  -->

<template>
    <div class="customer-add">
        <ft-dialog :visible.sync="dialogVisible" width="628px" title="新建客户" height="297px" @close="onCancel" v-loading="loading">
            <el-form :model='dataInfo' :rules="rules" ref='dataInfoRef' inline>
                <el-row style="margin-right: 45px;">
                    <el-col :md="24">
                        <ft-form-item label="客户名称:" prop="customerName">
                            <ft-main-pool-select v-model="dataInfo.customerName"
                                                class="cas-class"
                                                ref="customerSelect"
                                                @change="change"
                                                @emptyData="emptyData">
                            </ft-main-pool-select>
                        </ft-form-item>
                    </el-col>
                    <el-col :md="24">
                        <ft-form-item label="证件号码:" prop="identityNo">
                            <el-input v-if="false" v-model="dataInfo.identityNo"></el-input>
                            <span v-else>{{dataInfo.identityNo}}</span>
                        </ft-form-item>
                    </el-col>
                </el-row>
                <hr style="background-color:#E1E1E2; border:none; height:1px; margin: 24px -24px">
                <div style="float: right">
                    <el-button size="small" @click="onCancel" class="ft-reset_button">取消</el-button>
                    <el-button class="query-button" type="primary" size="small" @click="onSave" :disabled="disabledButton">保存</el-button>
                </div>
            </el-form>
        </ft-dialog>
    </div>
</template>

<script>
    import FtMainPoolSelect from "./ft/FtMainPoolSelect.vue";
    export default {
        name: 'CustomerInfoAdd',
        components: {
            FtMainPoolSelect,
        },
        data() {
            return {
                dataInfo: {},
                dialogVisible: false,
                // 取消/保存按钮控制
                disabledButton: false,
                loading : false,
                rules: {
                    customerName: [
                        {required: true, message: '客户名称不能为空', trigger: 'blur'}

                    ]
                },
            }
        },
        methods: {
            // 取消或返回
            onCancel() {
                this.$set(this.dataInfo, 'customerName', '')
                this.$set(this.dataInfo, 'identityNo', '')
                this.dialogVisible = false
            },
            onShowCancel() {
                this.dataInfo = {}
                this.dialogVisible = true
              //  if (this.$refs.customerSelect !== undefined) {
                    this.$refs.customerSelect.loadCustomerList()
              //  }
            },
            // 所选择的客户名称变化，回写客户类型和证件号码
            change(val) {
                this.$set(this.dataInfo, 'customerName', val.customerName)
                this.$set(this.dataInfo, 'identityNo', val.identityNo)
            },
            // 清空客户对应的数据
            emptyData(){
                this.$set(this.dataInfo, 'customerName', '')
                this.$set(this.dataInfo, 'identityNo', '')
            },
            // 新建客户变更保存
            onSave() {
                this.$refs['dataInfoRef'].validate(validate => {
                    if (validate) {
                            this.loading=true
                            this.$http.post('/joys-rest/ncls-cms/custInfo/save', this.dataInfo, {
                                params: {
                                    sourceModule:null
                                },
                            }).then(
                                resp => {
                                    let id =resp.body.customerId;
                                    if (id) {
                                        this.dialogVisible=false
                                        this.$set(this.dataInfo, 'customerName', '')
                                        this.$set(this.dataInfo, 'identityNo', '')
                                        this.$bus.sendMessage("OPEN_APPLET", {
                                            appletId: "8ab85aa3-2ae8-4b88-86ee-63c8809e704f",
                                            formUrl: "/joys/ncls-cms/#/companyCustomer/details",
                                            customerInfoId: resp.body.customerId
                                        })
                                        this.loading=false
                                    } else {
                                        this.loading = false
                                        this.$message.error(resp.body.message)
                                    }
                                }).catch(err => {
                                if (err.body) {
                                    this.$message.error(err.body.message || "新增失败！")
                                } else {
                                    this.$message.error("新增失败！")
                                }
                            }).finally(() => {
                                this.loading = false
                            })
                        }
                })
            },
        },
    }

</script>

<style lang="less">
    .customer-add{
        .ft-dialog__title-text {
            font-size: 14px;
        }
        .ft_input{
            width: 274px;
            height: 32px;
            border: 1px solid #D2D2D7;
            border-radius: 2px;
            border-radius: 2px;
        }
    }
</style>
